<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>租车网首页</title>
    <link rel="stylesheet" th:href="@{/res/layui/css/layui.css}">
    <!--引入awesome图标库的样式表-->
    <link rel="stylesheet" th:href="@{/res/font-awesome-4.7.0/css/font-awesome.css}">
    <link rel="stylesheet" th:href="@{/res/css/global.css}">
</head>
<body>
<!-- 你的HTML代码 -->
<div style="padding: 20px; background-color: #F2F2F2;">
    <div class="layui-row layui-col-space15">

        <div class="layui-col-md6">
            <div class="layui-card" style="height:500px;">
                <div class="layui-card-header">
                    <div>
                        <a href="/">首页</a> /
                        <a href="/demo/">演示</a> /
                        <a><cite>导航元素</cite></a>

                    </div>
                </div>
                <div class="layui-card-body">
                    <form class="layui-form" action="">

                        <div class="layui-form-item">
                            <label class="layui-form-label">汽车型号</label>
                            <div class="layui-input-block">
                                <input type="hidden" name="id" value=""/>
                                <input type="text" name="name" lay-verify="name" autocomplete="off" placeholder="请输入标题"
                                       class="layui-input">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">尺寸</label>
                                <div class="layui-input-inline">
                                    <select name="level">
                                        <option value="">请选择</option>
                                        <option value="微型" selected="">微型</option>
                                        <option value="紧凑型">紧凑型</option>
                                        <option value="中型">中型</option>
                                        <option value="大型">大型</option>

                                    </select>
                                </div>
                            </div>

                            <div class="layui-inline">
                                <label class="layui-form-label">类型</label>
                                <div class="layui-input-inline">
                                    <select name="type">
                                        <option value="">请选择</option>
                                        <option value="轿车" selected="">轿车</option>
                                        <option value="SUV">SUV</option>
                                        <option value="MPV">MPV</option>
                                    </select>
                                </div>
                            </div>

                            <div class="layui-inline">
                                <label class="layui-form-label">品牌</label>
                                <div class="layui-input-inline">
                                    <select name="brand">
                                        <option value="" selected>请选择</option>
                                        <option value="一汽大众">一汽大众</option>
                                        <option value="上汽大众">上汽大众</option>
                                        <option value="长安福特">长安福特</option>
                                    </select>
                                </div>
                            </div>
                        </div>


                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">租金</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="price" lay-verify="name" autocomplete="off"
                                           placeholder="请输入标题"
                                           class="layui-input">
                                </div>
                            </div>

                            <div class="layui-inline">
                                <label class="layui-form-label">使用年限</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="years" lay-verify="name" autocomplete="off"
                                           placeholder="请输入标题"
                                           class="layui-input">
                                </div>
                            </div>
                        </div>


                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">车型介绍</label>
                                <div class="layui-input-inline">
                                    <textarea class="layui-textarea" name="information" lay-verify="content"
                                              id="LAY_demo_editor"></textarea>
                                </div>
                            </div>

                            <div class="layui-inline">
                                <label class="layui-form-label">
                                    <button type="button" class="layui-btn" id="test1">上传图片</button>
                                </label>
                                <div class="layui-input-inline layui-upload-list">
                                    <img class="layui-upload-img" id="demo1" th:src="@{/res/images/car01.jpg}"
                                         style="height:150px;width:150px;">
                                    <p id="demoText"></p>
                                </div>
                            </div>


                        </div>


                        <div class="layui-form-item">
                            <div class="layui-input-block">
                                <button class="layui-btn" lay-submit="" lay-filter="update_cars">立即提交</button>
                                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                            </div>
                        </div>

                    </form>

                </div>
            </div>
        </div>

    </div>
</div>

<script th:src="@{/res/layui/layui.js}"></script>
<script th:inline="javascript">

    layui.use(['layer', 'element', 'carousel', 'form', 'rate', 'laypage'], function () {
        var layer = layui.layer,
            form = layui.form;
        var element = layui.element;
        var carousel = layui.carousel;
        var rate = layui.rate;
        var laypage = layui.laypage;

        var $ = layui.$;


        //监听导航点击
        element.on('nav(demo)', function (elem) {
            //console.log(elem)
            layer.msg(elem.text());
        });

    });

    //在这里编写js脚本

</script>
</body>
</html>